// 容器宽度的界限数组 对应的span值
const span = [24, 12, 8, 6, 5, 4, 3, 2, 1]
function $_resizeHandler(el, binding, vnode) {
  const { componentInstance } = vnode
  const rect = el.getBoundingClientRect()
  const rangeList = binding.value || [400, 550, 770, 1000, 1240, 1580]
  for (const index in rangeList) {
    if (rect.width - 1 < rangeList[index]) {
      componentInstance.span = span[index]
      return
    }
  }
}
export default {
  bind(el, binding, vnode) {
    window.addEventListener('resize', () => $_resizeHandler(el, binding, vnode))
  },
  inserted(el, binding, vnode) {
    $_resizeHandler(el, binding, vnode)
  },
  unbind(el, binding, vnode) {
    window.removeEventListener('resize', () => $_resizeHandler(el, binding, vnode))
  }
}
